import { FC } from 'react';

interface InfoFieldProps {
  label: string;
  value?: string | number | null;
  unit?: string;
}

export const InfoField: FC<InfoFieldProps> = ({ label, value }) => {
  return (
    <>
      {value || value === 0 ? (
        <div style={{ textAlign: 'center', marginRight: 20, marginBottom: 30 }}>
          <p style={{ fontSize: 14, color: '#666666', margin: 0, marginBottom: 10 }}>{label}</p>
          <p
            style={{
              fontSize: 18,
              fontWeight: 'bold',
              color: '#222222',
              margin: 0,
              textAlign: 'center',
            }}
          >
            {value ? `${value}` : value === 0 ? `0` : '--'}
          </p>
        </div>
      ) : null}
    </>
  );
};
